Skip to content

@W-20276592: Address autocompletion feature#3509

Draft
dannyphan2000 wants to merge 3 commits intodevelopfrom
feature/address-autocompletion-2
Draft

@W-20276592: Address autocompletion feature#3509
dannyphan2000 wants to merge 3 commits intodevelopfrom
feature/address-autocompletion-2

Conversation

@dannyphan2000
Copy link
Contributor

Merging address autocompletion feature to develop branch.

See original PR: #3071

Description

Merging address autocompletion feature to develop branch. The changes included are from previously approved PRs.
#2614
#2767
#2886
#2981
#3209

Screenshot 2025-11-21 at 11 47 37 AM

Types of Changes

  • Bug fix (non-breaking change that fixes an issue)
  • New feature (non-breaking change that adds functionality)
  • Documentation update
  • Breaking change (could cause existing functionality to not work as expected)
  • Other changes (non-breaking changes that does not fit any of the above)

Breaking changes include:

  • Removing a public function or component or prop
  • Adding a required argument to a function
  • Changing the data type of a function parameter or return value
  • Adding a new peer dependency to package.json

Changes

  • New environment variable (GOOGLE_CLOUD_API_KEY) that allows customers to enable the address autocompletion feature in checkout (and any address fields)
  • Introduction of Shopper Configuration SCAPI endpoint and usage in checkout
  • Address suggestions from Google Maps Platform are displayed to the user upon 3 or more characters in the input field
  • Address autocompletion for address fields upon choosing an address suggestion from the dropdown

How to Test-Drive This PR

  • Add an item to the cart and go to checkout. Fill out your contact information to go to shipping address section.
  • Country is auto-selected (United States), can change if you want.
  • Start typing 3 or more characters in the Address field.
  • Address Suggestions dropdown should be displayed to the buyer, with an option to temporarily close it (X icon).
  • Upon choosing an address suggestion, the address fields should be automatically populated.
  • Try the same with billing address (specify that it's different from shipping address).
  • Checkout can be completed as expected.

Checklists

General

  • Changes are covered by test cases
  • CHANGELOG.md updated with a short description of changes (not required for documentation updates)

Accessibility Compliance

You must check off all items in one of the follow two lists:

  • There are no changes to UI

or...

Localization

  • Changes include a UI text update in the Retail React App (which requires translation)

- Implemented address autocomplete dropdown using mock addresses
- Auto-fill address on choosing suggestion from dropdown
- Added Google API integration
- Sourced GCP API Key from Configuration API
- Added ShopperConfigurations hook for API key management
- Fixed accessibility, cleanup, and introduced caching by component
- Added translations and various fixes
Signed-off-by: d.phan <d.phan@salesforce.com>
Signed-off-by: d.phan <d.phan@salesforce.com>
@cc-prodsec
Copy link
Collaborator

cc-prodsec commented Dec 11, 2025

Snyk checks have passed. No issues have been found so far.

Status Scanner Critical High Medium Low Total (0)
Open Source Security 0 0 0 0 0 issues
Licenses 0 0 0 0 0 issues

💻 Catch issues earlier using the plugins for VS Code, JetBrains IDEs, Visual Studio, and Eclipse.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants